<template>
    <view class="container">
     <view class="list" v-if="bargain.length > 0">
       <view class="item" v-for="(item, index) in bargain" :key="index">
          <image class="goods-img" :src="item.image" mode="" />
          <view class="right">
            <view class="top">
              <view class="title">{{item.store_name}}-{{item.suk}}</view>
              <view class="score">{{item.total_price}}积分</view>
            </view>
            <view class="date">{{item.add_time}}</view>
          </view>
       </view>
       <Loading :loaded="status" :loading="loadingList"></Loading>
     </view>
     <view class="no-data-box" v-if="bargain.length == 0">
       <image src="./static/no_data.png" class="no-data-img" />
       <view class="text">暂无记录</view>
     </view>
    </view>
</template>

<script>
  import {
  	getIntegralOrderList
  } from "@/api/activity";
  import Loading from "@/components/Loading";
  
export default {
  components: {
  	Loading,
  },
  data() {
    return {
      goodsList: [],
      bargain: [],
      status: false, //砍价列表是否获取完成 false 未完成 true 完成
      loadingList: false, //当前接口是否请求完成 false 完成 true 未完成
      page: 1, //页码
      limit: 20, //数量
    }
  },
  onLoad: function() {
  	this.getIntegralOrderList();
  },
  onReachBottom() {
  	this.getIntegralOrderList();
  },
  methods: {
    getIntegralOrderList: function() {
    	var that = this;
    	if (that.loadingList) return;
    	if (that.status) return;
    	getIntegralOrderList({
    			page: that.page,
    			limit: that.limit
    		})
    		.then(res => {
    			that.status = res.data.length < that.limit;
    			that.bargain.push.apply(that.bargain, res.data);
    			that.page++;
    			that.loadingList = false;
    		})
    		.catch(res => {
    			that.$util.Tips({
    				title: res
    			})
    		});
    },
    returnHome(){
      // uni.switchTab({
      //   url: '/pages/car_index/index'
      // })
      uni.navigateTo({
        url: `/pages/integral_mall/index`
      })
    },
  }
}
</script>

<style lang="scss" scoped>
    .container{
      min-height: 100vh;
      background: #F6F6F6;
      text-align: center;
      .list{
         margin: 20rpx auto 0;
        .item{
          display: flex;
          width: 690rpx;
          padding: 30rpx;
          margin: 0 auto 20rpx;
          background: #FFFFFF;
          border-radius: 20rpx 20rpx 20rpx 20rpx;
          .goods-img{
            width: 180rpx;
            height: 180rpx;
            border-radius: 10rpx;
          }
          .right{
            margin-left: 30rpx;
            display: flex;
            justify-content: space-between;
            flex-direction: column;
            text-align: left;
            .top{
              
            }
            .title{
              margin-bottom: 10rpx;
              font-weight: 500;
              font-size: 32rpx;
              color: #191919;
              white-space: nowrap; /* 禁止文本换行 */
              overflow: hidden; /* 隐藏超出范围的内容 */
              text-overflow: ellipsis; /* 使用省略号 */
              width: 420rpx;
            }
            .score{
              font-size: 26rpx;
              color: #666666;
            }
            .date{
              font-size: 24rpx;
              color: #B9B9BD;
            }
          }
        }
      }
    }
    .no-data-box{
      .no-data-img{
        width: 360rpx;
        height: 360rpx;
        display: block;
        margin: 100rpx auto 10rpx;
      }
      .text{
        text-align: center;
        font-size: 26rpx;
        color: #B9B9BD;
      }
    }
</style>